<template>
  <div class="ChildPage TablePage" v-loading="loading">
    <vb-page ref="page" @onTableSelection="doSelect">
      <template #headerSearch-btn-append="{ searchForm }">
        <el-button type="warning" size="small" icon="el-icon-download" @click="doDownload(searchForm)">导出生产任务执行报表</el-button>
      </template>
      <template #headerSearch-append="scope">
        <div>
          <span style="font-size: 12px; padding-right: 4px; color: #666666">物料</span>
          <el-select filterable remote :remote-method="e => getMaterialList(e)" v-model="scope.searchForm.materialNo" size="small" clearable class="material" placeholder="请输入物料编码或者名称" style="margin-right: 10px">
            <el-option v-for="item in materialList" :key="item.fNumber" :label="item.fNumber + '：' + item.fName + ' ' + item.fSpecification" :value="item.fNumber" />
          </el-select>
        </div>
      </template>
      <template #table-boxCount="scope">
        {{ scope.row.boxCount || '-' }}
      </template>
      <template #table-count="scope">
        {{ scope.row.count? Number(scope.row.count.toFixed(2)): scope.row.count }}
      </template>
      <template #table-inCount="scope">
        {{ scope.row.inCount? Number(scope.row.inCount.toFixed(2)): scope.row.inCount }}
      </template>
      <template #table-colCount="scope">
        {{ scope.row.colCount? Number(scope.row.colCount.toFixed(2)): scope.row.colCount }}
      </template>
      <template #table-stockNo="scope">
        {{ getStockName(scope.row.stockNo) }}
      </template>
      <template #table-status="scope">
        <el-tag :type="scope.row.status === 'save'? 'info': (scope.row.status === 'audit'? 'success': 'danger')">{{ scope.row.status === 'save'? '保存': (scope.row.status === 'audit'? '审核': '关闭') }}</el-tag>
      </template>
      <template #footerBtn="data">
        已选行数:{{ selectionLength}}
      </template>
    </vb-page>
  </div>
</template>

<script>
export default {
  data() {
    return {
      materialLoading: false,
      dataLiat:[],
      materialList: [],
      selection: null,
      selectionLength:0
    }
  },
  methods : {
    async doDownload(searchForm) {
      this.loading = true
      try {
        let res = await this.callApi('download_prd_task_impl_list', searchForm)
        if (!res.res) return
      } finally {
        this.loading = false
      }
    },
    async getMaterialList(val) {
      if (!val) {
        this.materialList = []
        return
      }
      this.materialLoading = true
      try {
        const res = await this.callApi('get_material_by_key', { key: val, pageSize: 20 })
        if (!res.res) return
        this.materialList = res.data
      } finally {
        this.materialLoading = false
      }
    },
    doSelect(data) {
      this.selection = data
      this.selectionLength = this.selection.length ;
    },
  }
}
</script>

<style scoped>
</style>